<!-- Horizontal Form -->
 <div class="box box-info">
      <div class="box-header with-border">
        <h3 class="box-title">添加参数</h3>
      </div>
      <!-- /.box-header -->
      <!-- form start -->
      <form class="form-horizontal">
        <div class="box-body">
          <div class="form-group">
            <label for="nameId" class="col-sm-2 control-label">参数名</label>

            <div class="col-sm-10">
              <input type="text" class="form-control" name="name" id="nameId" placeholder="名称">
            </div>
          </div>
           <div class="form-group">
            <label for="valueId" class="col-sm-2 control-label">参数值</label>
            <div class="col-sm-10">
              <input type="text" class="form-control" name="name" id="valueId" placeholder="名称">
            </div>
          </div>
          <div class="form-group">
            <label for="noteId" class="col-sm-2 control-label">描述</label>

            <div class="col-sm-10">
              <input type="text" class="form-control" name="note" id="noteId" placeholder="描述">
            </div>
          </div>
        </div>
        <!-- /.box-body -->
        <div class="box-footer">
          <button type="button" class="btn btn-default btn-cancel">Cancel</button>
          <button type="button" class="btn btn-info pull-right btn-save">Save</button>
        </div>
        <!-- /.box-footer -->
      </form>
    </div>
    <script type="text/javascript">
    $(function(){
    	$(".box-footer")
    	.on("click",".btn-cancel",doCancel)
    	.on("click",".btn-save",doSaveOrUpdate);
    	
    	var data=$(".container-fluid").data("data");
    	if(data)doInitEditFormData(data);
    });
   
    //初始化表单数据
    function doInitEditFormData(data){
    	$("#nameId").val(data.name);
    	$("#valueId").val(data.value);
    	$("#noteId").val(data.note);
    }
    //点击退出按钮时执行此方法
    function doCancel(){
    	$(".container-fluid").load("config/listUI.do");
    	$(".container-fluid").removeData("data");
    }
    //点击保存按钮时执行此方法
    function doSaveOrUpdate(){//insert/update
    	//获取表单数据
    	var params=getEditFormData();
        //假如当前页面.container-fluid对象上绑定着值说明是修改
    	var data=$(".container-fluid").data("data");
    	if(data){
    		params.id=data.id;//修改时表单数据中需要添加id
    	}
    	//根据当前页面上是否绑定着值来定义url
    	var insertUrl="config/doSaveObject.do";
    	var updateUrl="config/doUpdateObject.do";
    	var url=data?updateUrl:insertUrl;
    	
    	//异步提交数据
    	$.post(url,params,function(result){
    		if(result.state==1){
    		alert(result.message);
    		doCancel();
    		}else{
    		alert(result.message);
    		}
    	})
    }
    //获取表单数据
    function getEditFormData(){
    	var params={
    		name:$("#nameId").val(),
    		value:$("#valueId").val(),
    		note:$("#noteId").val()
    	}
    	return params;
    }
    </script>
    
    
    
    
    
    
    
    